import { map } from 'lodash'

export default {
  data() {
    return {
      selectedIndex: undefined
    }
  },
  beforeDestroy () {
    this.removeEvent()
  },
  methods: {
    /**
     * @msg: 按键操作完之后的操作
     * @param {type}
     * @return:
     */
    eventTableKeyUpAfter (code) {
      this.$nextTick(() => {
        this.tableData = map(this.tableData, (item, index) => {
          if (index === this.selectedIndex) {
            item._highlight = true
          } else {
            item._highlight = false
          }
          return item
        })
      })
      this.setTableScroll(code)
      this.currentSelectedTableData()
    },
    /**
     * @msg: 表格滚动条控制
     * @param {type}
     * @return:
     */
    setTableScroll (code) {
      if (!this.$refs.table) {
        return
      }
      const rowHeight = this.$refs.table.$el.querySelector('.ivu-table-row').offsetHeight

      const scrollTop = this.$refs.table.$el.querySelector('.ivu-table-body').scrollTop
      const tableAreaHeight = this.$refs.table.$el.querySelector('.ivu-table-body').offsetHeight

      const num = this.selectedIndex + 1
      if ((num * rowHeight + rowHeight) > tableAreaHeight && code === 83) {
        this.$refs.table.$el.querySelector('.ivu-table-body').scrollTop += rowHeight
      }

      if ((this.selectedIndex * rowHeight - rowHeight) < scrollTop && code === 87) {
        this.$refs.table.$el.querySelector('.ivu-table-body').scrollTop -= rowHeight
      }
    },
    /**
     * @msg: 文档事件绑定
     * @param {type}
     * @return:
     */
    dispatchEvent () {
      document.addEventListener('keyup', this.handleKeyUp)
    },
    removeEvent() {
      document.removeEventListener('keyup', this.handleKeyUp)
    },
    /**
     * desc: 键盘事件
     * param {type}
     * return {type} void
     */
    handleKeyUp(event) {
      if (this.hasMoveFlag) {
        return
      }

      switch (Number(event.keyCode)) {
        case 87: // w 表格下选择
          if (this.tableData.length < 2) return
          if (this.selectedIndex <= 0) {
            this.selectedIndex = 0
          } else {
            this.selectedIndex--
          }
          this.eventTableKeyUpAfter(Number(event.keyCode))
          break
        case 83: // s 表格上选择
          if (this.tableData.length < 2) return
          const len = this.tableData.length
          if (this.selectedIndex >= len - 1) {
            this.selectedIndex = len - 1
          } else {
            this.selectedIndex++
          }
          this.eventTableKeyUpAfter(Number(event.keyCode))
          break
        case 65: // a 折线图左移选择点
          if (this.zhexiantuFinishedStatus) {
            if (this.zhexianKeyUpSelecteIndex > 0) {
              this.zhexiantuHasSelected = true
              this.zhexianKeyUpSelecteIndex--
              this.getZhexianSelectedPoint()
            }
          }
          break
        case 68: // d 折线图右移选择点
          if (this.zhexiantuFinishedStatus) {
            const { seriesData = [] } = this.zhexianDayData
            const len = seriesData.length
            if (this.zhexianKeyUpSelecteIndex < len - 1) {
              this.zhexiantuHasSelected = true
              this.zhexianKeyUpSelecteIndex++
              this.getZhexianSelectedPoint()
            }
          }
          break
        case 75: // k 设置折线图开始点
          if (this.zhexiantuHasSelected) {
            this.keyUpSetZhexianData('min')
          }
          break
        case 74: // j 设置折线图结束点
          this.keyUpSetZhexianData('max')
          break
        case 81: // q 清除折线图设置点
          this.keyUpSetZhexianData('cancel')
          break
        case 66: // b 保存设置折线图数据
          this.saveData()
          break
        default:
          break
      }
    }
  }
}
